package com.wuyan.warriorsoffate.ui.page

import androidx.compose.foundation.*
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.Checkbox
import androidx.compose.material.Icon
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.draw.shadow
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp
import androidx.navigation.NavController
import com.wuyan.warriorsoffate.R
import com.wuyan.warriorsoffate.data.NesViewModel
import com.wuyan.warriorsoffate.ui.theme.WeTheme
import com.wuyan.warriorsoffate.ui.view.*

//显示武将详细信息
@Composable
fun PersonInfoPage(nes: NesViewModel, id:Int, navController: NavController, modifier: Modifier = Modifier){
    val person = nes.persons[id]
    Column(modifier = modifier
        .background(WeTheme.colors.bg)
        .padding(WeTheme.weDp.paddingSmall)
        .clip(shape = RoundedCornerShape(WeTheme.weDp.paddingMedium)), horizontalAlignment = Alignment.CenterHorizontally) {
        Box(modifier = Modifier
            .wrapContentHeight()
            .fillMaxWidth()){
            Icon(painter = painterResource(id = R.drawable.back), contentDescription = "返回",
                modifier = Modifier
                    .padding(start = WeTheme.weDp.marginMedium)
                    .align(Alignment.CenterStart)
                    .size(WeTheme.weDp.iconDp)
                    .clickable {
                        navController.popBackStack()
                    }, tint = WeTheme.colors.text)
            WeText(text = person.name,
                color = WeTheme.colors.text,
                modifier = Modifier
                    .align(Alignment.Center)
                    .padding(WeTheme.weDp.marginLarge)
                    .clip(CircleShape)
                    .border(1.5.dp, WeTheme.colors.text, shape = CircleShape)
                    .padding(WeTheme.weDp.paddingMedium))
        }

        StaggeredGrid(modifier = Modifier
            .wrapContentSize()
            .padding(WeTheme.weDp.paddingSmall)){
            WeLabel(text = "名称:"+person.name)
            WeLabel(text = "对白名称:"+person.dialogueName)
            DisplayInfo(title = "武力：", dec = person.force, change = {person.force=it})
            DisplayInfo(title = "智力：", dec = person.brains, change = {person.brains=it})
            DisplayInfo(title = "章节：", dec = person.place, change = {person.place=it})
            DisplayInfo(title = "敌将防御：", dec = person.foeDefense, change = {person.foeDefense=it})
            DisplayTroopsInfo(title = "敌将兵力流:", nes = nes, dec = person.foeTroops, change = {person.foeTroops=it})
            DisplayTroopsInfo(title = "我方兵力流:", nes = nes, dec = person.troops, change = {person.troops=it})
            Row(modifier = Modifier
                .padding(WeTheme.weDp.marginSmall)
                .shadow(
                    WeTheme.weDp.marginSmall,
                    shape = RoundedCornerShape(WeTheme.weDp.marginSmall)
                )
                .background(
                    WeTheme.colors.label1,
                    shape = RoundedCornerShape(WeTheme.weDp.marginSmall)
                )
                .wrapContentSize()
                .padding(WeTheme.weDp.paddingSmall), verticalAlignment = Alignment.CenterVertically) {
                Spacer(modifier = Modifier.size(WeTheme.weDp.marginSmall))
                WeText(text = "是否收编：")
                Checkbox(checked = person.embody, onCheckedChange = { person.embody = it} )
            }
            DisplayInfo(title = "速度：", dec = person.speed, change = {person.speed=it})
        }
        TroopsPage(nes = nes,modifier = Modifier.weight(1.0f))
    }
}
//显示单条数据（text）
@Composable
fun DisplayInfo(title:String,dec:Int,change:(value:Int)->Unit){
    Row(modifier = Modifier
        .padding(WeTheme.weDp.marginSmall / 2)
        .shadow(WeTheme.weDp.marginSmall, shape = RoundedCornerShape(WeTheme.weDp.marginSmall))
        .background(WeTheme.colors.label1, shape = RoundedCornerShape(WeTheme.weDp.marginSmall))
        .wrapContentSize()
        .padding(WeTheme.weDp.paddingSmall), verticalAlignment = Alignment.CenterVertically) {
        WeText(text = title)
        TextFieldDec255(dec = dec,change)
        Spacer(modifier = Modifier.size(WeTheme.weDp.marginMedium))
        WeLabel(text = "十六进制："+dec.toString(16),
            bgColor = WeTheme.colors.text)
    }
}
//显示兵力流派
@Composable
fun DisplayTroopsInfo(title:String, nes: NesViewModel, dec:Int, change:(value:Int)->Unit){
    Row(modifier = Modifier
        .padding(WeTheme.weDp.marginSmall / 2)
        .shadow(WeTheme.weDp.marginSmall, shape = RoundedCornerShape(WeTheme.weDp.marginSmall))
        .background(WeTheme.colors.label1, shape = RoundedCornerShape(WeTheme.weDp.marginSmall))
        .wrapContentSize()
        .padding(WeTheme.weDp.paddingSmall), verticalAlignment = Alignment.CenterVertically) {
        WeText(text = title)
        TextFieldDec255(dec = dec,change)
        Spacer(modifier = Modifier.size(WeTheme.weDp.marginMedium))
        if(dec<0x80){
            WeLabel(text = "实际:"+nes.troops[dec].value,
                bgColor = WeTheme.colors.text)
        }
    }
}
//显示兵力流派详细值
@Composable
fun TroopsPage(nes: NesViewModel, modifier: Modifier = Modifier){
    val isHex= remember {
        mutableStateOf(false)
    }
    val state = rememberScrollState()
    Box(modifier = modifier){
        Column(modifier = Modifier
            .padding(WeTheme.weDp.paddingSmall / 2)
            .fillMaxSize()
            .background(WeTheme.colors.bg)
            .shadow(5.dp, shape = WeTheme.shapes.small)
            .padding(WeTheme.weDp.paddingSmall)
            .clip(shape = RoundedCornerShape(WeTheme.weDp.paddingMedium)),
            horizontalAlignment = Alignment.CenterHorizontally) {
            Box(modifier = Modifier
                .wrapContentHeight()
                .fillMaxWidth()
                .padding(start = WeTheme.weDp.paddingMedium, end = WeTheme.weDp.paddingMedium)){
                WeText(text = "固定兵力流派",
                    color = WeTheme.colors.text,
                    modifier = Modifier
                        .align(Alignment.Center)
                        .padding(WeTheme.weDp.marginSmall)
                        .clip(CircleShape)
                        .border(1.5.dp, WeTheme.colors.text, shape = CircleShape)
                        .padding(WeTheme.weDp.paddingSmall))
                WeLabel(text = if (isHex.value) "HEX" else "DEC",
                    bgColor = WeTheme.colors.text,
                    modifier = Modifier
                        .align(Alignment.CenterEnd)
                        .clickable {
                            isHex.value = !isHex.value
                        })
            }
            StaggeredGrid(modifier = Modifier
                .weight(1.0f)
                .verticalScroll(state)) {
                for (i in nes.troops.indices){
                    Row(modifier = Modifier
                        .padding(WeTheme.weDp.marginSmall)
                        .wrapContentHeight()
                        .weight(1.0f)
                        .background(WeTheme.colors.text, shape = WeTheme.shapes.small)
                        .padding(WeTheme.weDp.paddingSmall),
                        verticalAlignment = Alignment.CenterVertically) {
                        if (isHex.value){
                            WeText(text = "0x"+i.toString(16)+":", color = WeTheme.colors.onText)
                            TextFieldHex65535(dec = nes.troops[i].value, change = {
                                nes.troops[i].value=it
                            })
                        }else{
                            WeText(text = "$i:", color = WeTheme.colors.onText)
                            TextFieldDec65535(dec = nes.troops[i].value, change = {
                                nes.troops[i].value=it
                            })
                        }
                    }

                }
            }
        }
    }
}